<template>
	<view class="content">
		<view class="header">
			<view class="header_bg">
				<view class="school_user">
					<view class="school_user_left">
						<image src="../../../static/school/tx.png" mode=""></image>
						<text>校园名称</text>
					</view>
					<view class="school_user_right" @click="tosf()">
						<image src="../../../static/school/qh.png" mode=""></image>
						<text>切换校园</text>
					</view>
				</view>


				<view class="search">
					<image src="../../../static/home/search.png" mode=""></image>
					<input type="text" value="" placeholder="搜素" />
				</view>

				<view class="sx">
					<text>筛选</text>
					<image src="../../../static/school/zs.png" mode=""></image>
				</view>

				<view class="supplierlist">
					<view class="supplierlist_left">
						<image src="../../../static/my/shoplogo.png" mode=""></image>
					</view>
					<view class="supplierlist_right">
						<view class="supplierlist_right_tit1">
							<text>潜意识投射测试</text>
						</view>
						<view class="supplierlist_right_tit2">
							<text>入园价格</text>
						</view>
						<view class="supplierlist_right_price">
							零售价  <text>￥199</text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				supplierlist: [{
					id: 0,
					img: '',
					title: '潜意识投射测试',
					price: '1212'
				}]
			}
		},
		methods: {

		}
	}
</script>

<style>
	.header {
		width: 750rpx;
		height: 240rpx;
		background: linear-gradient(180deg, #1789FF 0%, #93C3F9 100%);
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.header_bg {
		padding-top: 40rpx;
	}

	.content {
		width: 750rpx;
		height: 100vh;
		background: #FAFAFA;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.school_user {
		display: flex;

		align-items: center;
		padding-left: 30rpx;
		padding-right: 30rpx;
	}

	.school_user_left {
		display: flex;
		align-items: center;
	}

	.school_user_left image {
		width: 104rpx;
		height: 104rpx;
	}

	.school_user_left text {

		font-family: PingFang SC, PingFang SC;
		font-weight: bold;
		font-size: 32rpx;
		color: #FFFFFF;
		margin-left: 32rpx;
	}

	.school_user_right {
		width: 196rpx;
		height: 80rpx;
		background: #FFFFFF;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		margin-left: auto;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.school_user_right image {
		width: 32rpx;
		height: 40rpx;
	}

	.school_user_right text {
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #666666;
	}

	.search {
		width: 690rpx;
		height: 88rpx;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		display: flex;
		align-items: center;
		margin: 24rpx auto 0;
	}

	.search image {
		width: 34rpx;
		height: 34rpx;
		margin-left: 28rpx;
	}

	.search input {
		margin-left: 30rpx;
	}

	.sx {
		width: 690rpx;
		height: 104rpx;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		margin: 40rpx auto 0;
		display: flex;
		align-items: center;
	}

	.sx text {
		font-family: PingFang SC, PingFang SC;
		font-weight: bold;
		font-size: 32rpx;
		color: #333333;
		margin-left: 32rpx;
	}

	.sx image {
		height: 40rpx;
		width: 40rpx;
		margin-left: auto;
		margin-right: 32rpx;
	}

	.supplierlist {
		width: 690rpx;
		height: 288rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 12rpx 20rpx 0rpx rgba(158, 158, 158, 0.04);
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		margin: 32rpx auto 0;
		display: flex;
		align-items: center;
	}

	.supplierlist_left image {
		width: 216rpx;
		height: 216rpx;
		margin-left: 28rpx;
	}
	.supplierlist_right{
		height: 216rpx;
		margin-left: 32rpx;
	}
	.supplierlist_right_tit1 {
		font-family: PingFang SC, PingFang SC;
		font-weight: bold;
		font-size: 32rpx;
		color: #333333;
	}
	.supplierlist_right_tit2{
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #666666;
		margin-top: 52rpx;
	}
	.supplierlist_right_price{
		width: 240rpx;
		height: 48rpx;
		background: #000000;
		border-radius: 8rpx 0rpx 0rpx 8rpx;
		opacity: 0.4;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 20rpx;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		padding-left: 24rpx;
		margin-top: 32rpx;
	}
	.supplierlist_right_price text{
		font-family: PingFang SC, PingFang SC;
		font-weight: bold;
		font-size: 24rpx;
		color: #FFFFFF;
	}
</style>